<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
    <meta name="author" content="">
    <title></title>  <link rel="icon" href="/template/pc1/images/wmh_favicon.ico" type="image/x-icon" />
    <% include("../inc/list_css.html"){}%>
</head>
<body>
<div class="ibox ">
    <div class="ibox-title">
        <div class="pull-left mbx navbar_title">
            <span>商城管理 </span>
            <span class="line">/</span>
            商品列表
        </div>
    </div>

    <div class="ibox-content">
        <div class="wrapper wrapper-content">
            <div class="row">
                <div class="col-md-12">


                    <div class="alert alert-warning alert-dismissable">
                        <button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button>
                        可以对商品的进行管理，对商品进行增删改查。<br>
                        在维护商品规格参数时，先统一添加各个规格，再逐个修改单价和个性化信息。<br>
                        <b>排序小贴士</b>：把本页面最下面一行的“每页显示记录”数目调整到最大或者搜索某一类别，然后在列表中的排序输入框中输入序号，自动保存，页面按照正序哦
                    </div>
                    <div class="btn-group margin-vertical-20_10">
                        <button class="hive-btn-md-large hive-btn-primary" id="add">
                            <i class="icon-add" aria-hidden="true"></i>&nbsp;添加商品
                        </button>
                    </div>
                    <table data-toggle="table " id="table" data-show-export="true"
                           class=" table-striped table-no-bordered fixed-table-container table-row-border-color table-hovered table-hover">
                        <thead class="table-header">
                        <tr>
                            <th data-field="name" data-formatter="nameFormatter">名称</th>
                            <th data-field="categoryName">产品类别</th>
                            <th data-field="productSn">编码</th>
                            <th data-field="price" data-formatter="priceFormatter">销售价</th>
                            <th data-field="marketPrice">市场价</th>
                            <th data-field="isMarketable" data-formatter="boolFormatter">是否上架</th>
                            <th data-field="isBest" data-formatter="boolFormatter">是否精品</th>
                            <th data-field="isNew" data-formatter="boolFormatter">是否最新</th>
                            <th data-field="store" data-formatter="storeFormatter" >库存</th>
                            <th data-field="createDate">创建日期</th>
                            <!--<th data-field="sortNo" data-formatter="sortNoFormatter" >排序号</th>-->
                            <th data-field="head" data-formatter="opFormatter" data-halign="center" data-align="center"
                                data-width="120">操作
                            </th>
                        </tr>
                        </thead>
                    </table>

                </div>
            </div>
        </div>
    </div>
</div>


<% include("../inc/list_js.html"){}%>
<script>

    function updateOrder() {
        alert(1111);
    }

    function opFormatter(value, row, index) {
        var html = '';
        html += '<a href="javascript:void(0)" class="icon-edit hive_icon color_normal" onclick="edit(\'' + row.id + '\');" data-toggle="tooltip" data-placement="top" title="编辑"></a>';
        /*html += '<a href="javascript:void(0)" class="icon-tab_details hive_icon color_normal" onclick="details(\'' + row.id + '\');" data-toggle="tooltip" data-placement="top" title="商品详情"></a>';*/
        /*html += '<a href="javascript:void(0)" class="icon-spread hive_icon color_normal" onclick="batch(\'' + row.id + '\');" data-toggle="tooltip" data-placement="top" title=" 批次号及商品码管理"></a>';*/
        html += '<a href="javascript:void(0)" class="icon-delete hive_icon color_danger" onclick="del(\'' + row.id + '\');" data-toggle="tooltip" data-placement="top" title="删除"></a>';
        /*html += '<a href="javascript:void(0)" class="icon-gifts hive_icon color_normal" onclick="addgift(\'' + row.id + '\');" data-toggle="tooltip" data-placement="top" title="礼品互赠"></a>';*/
        return html;
    }

    function nameFormatter(value, row, index) {//alert(row.isShowSku+" "+row.specificationtype);
        if (row.valuenames) {
            if(row.isShowSku)
                return value + "<span style='color: #00a0e9;margin-left: 5px'>[" + row.valuenames + "]</span>";
            else
                return value;
        } else
            return value;
    }

    function priceFormatter(v, row, index) {
        return "<input onblur='updatePrice(\""+row.id+"\",this)'  class='sort blurInput' value='" + (v == null ? '0' : v) + "' style='max-width: 86px;text-align: center'/>";

    }

    function storeFormatter(v, row, index) {
        return "<input onblur='updateStore(\""+row.id+"\",this)'  class='sort blurInput' value='" + (row.store - row.freezeStore) + "' style='max-width: 86px;text-align: center'/>";
    }

    function sortNoFormatter(v, row, index) {

        return "<input onblur='updateBlur(\""+row.id+"\",\""+v+"\")'  class='sort blurInput' id='" + row.id + "' value='" + (v == null ? '0' : v) + "' style='width: 25px;text-align: center'/>";

    }


    function boolFormatter(v) {
        if (v)
            return '是';
        else
            return '否';
    }

    function del(v) {

        parent.layer.confirm('您确定要删除吗？', {
            btn: ['是', '否'] //按钮
        }, function () {
            $.post('delete', {"ids": v}, function (e) {
                if (e.state == 'fail') {
                    parent.layer.msg(e.info)
                } else {
                    parent.layer.msg('删除成功');
                    $('#table').bootstrapTable('refresh');
                }
            })
        });


    }

    function edit(v) {
        location.href = "edit?id=" + v;
    }

    function batch(v) {
        location.href = "/mall/admin/oneCode/batch/batchList?id=" + v;
    }
    function addgift(v) {
        location.href = "addgift?id=" + v;
    }

    /**
     * 加载页面数据
	 * 1.function xxx(){}---这是函数声明
	 * 		function (){}---这也是函数声明，但由于没有给函数命名，所以叫匿名函数
	 * 		var str = function(){}---这是函数表达式
	 * 2.函数表达式后面可以加括号立即调用该函数
	 * 3.(function(){}).()---在匿名函数外加上括号，就可以将它转化为函数表达式。
	 * 		然后在加上括号，就可以立即调用该函数
     * */
    var table;
    (function () {

        table = $('#table').bootstrapTable({
            url: "ajaxlist",    //请求后台的URL
            dataType: 'json',   //服务器返回的数据类型
            contentType: 'application/json',  //发送信息至服务器时内容编码类型
            search: true,  //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
            searchAlign: 'right',  //
            pagination: true,  //是否显示分页
            showRefresh: true,  //是否显示刷新按钮
            pageSize: 20,  //每页的记录数
            showToggle: false,//是否显示card/table切换按钮
            showColumns: true,//是否显示内容列下拉框
            pageList: [20, 50, 100],  //可供选择的每页的行数
            iconSize: 'outline',
            toolbar: '#add',  //工具按钮用哪个容器
            paginationHAlign: 'right', //right, left
            paginationVAlign: 'bottom',
            icons: {
                refresh: 'icon-refresh',
                toggle: 'glyphicon-list-alt',
                columns: 'icon-select',
                export: 'icon-export'
            },
            responseHandler: function (res) {
                $("#dsh").html(res.length);
                return res;
            },
            formatNoMatches: function () { //判断有无数据
                var imghtml = '<div class="flexed_column content_center content_alignCenter padding-20"><img src="https://static.9hive.cn/global/img/nodata.png" class="no_data"/><span class="font-size-16">暂无数据</span></div>';
                return imghtml;
            },
            formatLoadingMessage: function () {  //数据加载中样式
                return ' <div id="loading"><div id="loading-center">' +
                    '<div id="loading-center-absolute"><div class="object" id="object_one">' +
                    '</div><div class="object" id="object_two"></div><div class="object" id="object_three">' +
                    '</div><div class="object" id="object_four"></div></div></div>努力加载中...</div>'
            },
        });

        $('#add').on('click', function (e) {
            location.href = 'add';
        });

        $(".wrapper").tooltip({selector: "[data-toggle=tooltip]", container: "body"});


    })();

    function getIdSelections() {
        console.log( $.map(table.bootstrapTable('getSelections'), function(row) {
            return row.id
        }))
    }

   function updateBlur(v,v2) {

       var v2 = $("#" + v).val();

        $.post('updateBlur',{"id":v,"order":v2},function (e) {
            if(e.state == "fail"){
                parent.layer.msg(e.info);
            }else{

                parent.layer.msg("修改成功!");
               // $('#table').bootstrapTable('refresh');
            }
        })


    }

    function updatePrice(id,obj) {

        var price = obj.value;

        $.post('updatePrice',{"id":id,"price":price},function (e) {
            if(e.state == "fail"){
                parent.layer.msg(e.info);
            }else{
                parent.layer.msg("修改成功!");
                // $('#table').bootstrapTable('refresh');
            }
        })
    }

    function updateStore(id,obj) {

        var store = obj.value;

        $.post('updateStore',{"id":id,"store":store},function (e) {
            if(e.state == "fail"){
                parent.layer.msg(e.info);
            }else{
                parent.layer.msg("修改成功!");
                // $('#table').bootstrapTable('refresh');
            }
        })
    }

    function details(v) {
        window.location.href="/mall/admin/oneCode/product/detailForm?productId="+v;
    }

</script>
</body>
</html>